<script lang="ts" setup >
  import Imgrefush from "@/assets/png/st-renew 1.svg"
  import ImgStop from "@/assets/png/stop.svg"
  import { flgStatus,useContent,flgStop } from "../hooks"
  const { onStopChange} =useContent()

</script>
<template>
    <div class="status" v-if="flgStatus">
        <div class="status_box status" @click="onStopChange">
            <div style="width: 1.5rem;height: 0.5rem;">
                <van-icon v-show="flgStop === '停止生成'"  :name="ImgStop"  size="1.5rem" /> 
                <van-icon v-show="flgStop === '重新生成'"   style="margin-top: 2px;" :name="Imgrefush"  size="0.4rem" /> 
            </div>
            <div  style="margin-top: 0px;">{{ flgStop }}</div>
        </div>
    </div>
</template>
<style>
.status{
    display: flex;
    justify-content: center ;
    align-content: center;
   
}
.status_box{
    background-color:#fff;
    border-radius: 10px;
    padding: 4px 10px;
    box-sizing: border-box;
}
</style>